<template>
  <div>
    <el-dialog title="新增区域" class="noselect"
               v-dialogdrag=" { target:'.el-dialog__header',container:'.el-dialog',border:'.el-dialog__wrapper'}"
               :close-on-click-modal="false" :visible.sync="showDialog" :before-close="handleClose">
      <div style="margin: 20px;"></div>
      <el-form :model="modelForm" ref="modelForm" label-width="100px" class="demo-ruleForm">
        <el-form-item label=" " prop="name" :rules="[{ required: true, message: '请输入区域名称', trigger: 'blur' }]">
          <el-input placeholder="请输入区域名称" v-model="modelForm.name" auto-complete="off" :maxlength="25" size="medium" >
            <template slot="prepend">
              <el-tooltip placement="top" content="请输入区域名称">
                <el-button tabIndex="-1">区域名称</el-button>
              </el-tooltip>
            </template>
          </el-input>
        </el-form-item>
        <!-- <el-form-item label=" " prop="parentId" :rules="[{ required: true, message: '请选择所属业态', trigger: 'blur' }]">
          <div class="el-input el-input-group el-input-group--prepend el-input--medium" >
            <div class="el-input-group__prepend" tabindex="-1">所属业态</div>
            <el-cascader :disabled="isUpdate" placeholder="请选择" class="el-cascader-margin w-100p"  size="medium"
                         :options="treeData"
                         :show-all-levels="false" v-model="downCategeryId"
                         change-on-select>
            </el-cascader>
          </div>
        </el-form-item> -->
      </el-form>
      <div class="foot-bar-button">
        <el-button type="primary" @click="submitForm('modelForm')" size="medium">提交</el-button>
        <el-button @click="resetForm('modelForm')" size="medium">取消</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
//注意路径
export default {
  props: ["isShow", "id"], //参数
  data() {
    return {
      modelForm: {},
      showDialog: false,
      activityId: "",
      isSave: true,
      downCategeryId: [],
      isUpdate: false,
      treeData: []
    };
  },
  watch: {
    isShow: function(newValue, oldValue) {
      this.showDialog = newValue;
      this.modelForm={};
      if (newValue) {
        if (this.id != "") {
          this.activityId = this.id;
          this.isSave = false;
          this.isUpdate = true;
          this.$axios
            .get("organization/districts/" + this.activityId + "/update")
            .then(data => {
              this.modelForm = data.content.district;
            });
        } else {
          this.isSave = true;
          this.isUpdate = false;

        }
      }
    }
  },
  created() {
    window.this = this;
  },
  methods: {
    newLabel(newList) {
      if (newList) {
        for (var i = 0; i < newList.length; i++) {
          newList[i].label = newList[i].name;
          newList[i].value = newList[i].id + "";
          newList[i].children = null;
        }
      }
    },
    goBack() {
      this.router.go(-1);
    },
    submitForm(formName) {
      this.$refs[formName].validate(valid => {
        if (valid) {
          if (this.isSave) {
            this.$axios
              .post("organization/districts/create", this.modelForm,"json",true)
              .then(data => {
                if (data.status == 200) {
                  this.$message({
                    message: data.message,
                    type: "success"
                  });
                  this.$emit("addSuccess");
                } else {
                  this.$message.error(data.message);
                }
              });
          } else {
            this.modelForm._method = "PUT";
            this.$axios
              .put(
                "organization/districts/" + this.activityId + "/update",
                this.modelForm,
                "json",true
              )
              .then(data => {
                if (data.status == 200) {
                  this.$message({
                    message: data.message,
                    type: "success"
                  });
                  this.$emit("addSuccess");
                } else {
                  this.$message.error(data.message);
                }
              });
          }
        } else {
          return false;
        }
      });
    },
    resetForm(formName) {
      this.$emit("close");
      this.showDialog = false;
    },
    handleClose(done) {
      this.$emit("close");
      done();
    },
    isNum(item, key) {
      var r = /^\+?[1-9][0-9]*$/;
      if (!r.test(item[key])) {
        item[key] = "0.00";
      } else {
        item[key] = item[key];
      }
    },
    isDouble(item, key) {
      var isNum = /^(([1-9][0-9]*)|(([0]\.\d{1,2}|[1-9][0-9]*\.\d{1,2})))$/;
      if (!isNum.test(item[key])) {
        item[key] = "0.00";
      } else {
        item[key] = item[key];
      }
    }
  }
};
</script>
<style scoped>
</style>
